<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>clear both</title> 
<style type="text/css"> 
.outer{border: 1px solid #ccc;background: #fc9;color: #fff; margin: 50px auto;padding: 50px;}
.div1{width: 80px;height: 80px;background: red;float: left;}
.div2{width: 80px;height: 80px;background: blue;float: left;}
.div3{width: 80px;height: 80px;background: sienna;float: left;}
ul {
  background-color: aquamarine;
  display: inline-block;
  color: black;
}
li {
  margin: 10px;
}
/*.clear{
	overflow: hidden;
	zoom: 1;//IE6
}*/
.outer {zoom:1;}    /*==for IE6/7 Maxthon2==*/
.outer:after {
clear: both;
content: '';
display: table;
} 
 
</style> 
</head> 
<body> 
<div class="outer">
    <div class="div1">1</div>
    <div class="div2">2</div>
    <div class="div3">3</div>
</div>
</body> 
</html> 

